.section-title {
	margin-bottom: 30px;
	
	@include media-query(767px) {
		margin-bottom: 20px;
	}

	> span {
		font-size: 15px;
		font-size: calc-rem-value(15);
		font-weight: 500;
		color: $theme-primary-color;
		text-transform: capitalize;
		display: block;
    	margin-top: -0.2em;
	}

	h2 {
		font-size: 38px;
		font-size: calc-rem-value(38);
		font-weight: bold;
		margin: 0.1em 0 0;

		@include media-query(991px) {
			font-size: 35px;
			font-size: calc-rem-value(35);
		}

		@include media-query(767px) {
			font-size: 30px;
			font-size: calc-rem-value(30);
		}
	}
}

.section-title-s2 {
	@extend .section-title;
	margin-bottom: 60px;
	
	@include media-query(991px) {
		margin-bottom: 20px;
	}
	
	@include media-query(767px) {
		margin-bottom: 20px;
	}
}

.section-title-s3 {
	@extend .section-title-s2;
	text-align: center;

	@include media-query(991px) {
		margin-bottom: 40px;
	}
	
	@include media-query(767px) {
		margin-bottom: 40px;
	}

	h2 {
		color: $white;
		margin-bottom: 0.5em;
	}

	p {
		color: #d2d2d2;
		margin: 0;
	}
}

.section-title-s4 {
	@extend .section-title-s3;

	h2 {
		color: $heading-color;
	}

	margin-bottom: 0;

	@include media-query(991px) {
		margin-bottom: 0;
	}
	
	@include media-query(767px) {
		margin-bottom: 20px;
	}
}

.section-title-s5 {
	@extend .section-title-s2;
	text-align: center;
	margin-bottom: 50px;
	
	@include media-query(991px) {
		margin-bottom: 40px;
	}
	
	@include media-query(767px) {
		margin-bottom: 30px;
	}

	h2 {
		margin-bottom: 0.4em;
	}
}